<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="https://at.alicdn.com/t/font_2583540_5mdmfdeyc6v.css">
    <link rel="stylesheet" href="css/index.css">
</head>
<body>
    <div class="music">
        <div class="head">
            <div class="nav-personage">
                <div class="p1">
                    <ul>
                        <li class="hb"><a href="#">网易云音乐</a>
                            <div class="tb"></div>
                        </li>
                        <li><a href="#">发现音乐</a></li>
                        <li><a href="#">我的音乐</a></li>
                        <li><a href="#">朋友</a></li>
                        <li><a href="#">商城</a></li>
                        <li><a href="#">音乐人</a></li>
                        <li><a href="#">下载客户端</a></li>
                    </ul>
                    <img class="wyy" src="images/wyy.png">
                    <div class="hot">HOT</div>
                </div>
                <div class="but">
                    <i class="iconfont icon-xingtaiduICON_sousuo---copy"></i>
                    <input type="text" placeholder="音乐视频电台/用户">
                    <button>创作中心</button>
                    <button>登录</button>
                </div>
            </div>
            <div class="nav-referrals">
                <div>
                    <ul>
                        <li><a href="#">推荐</a></li>
                        <li><a href="#">排行榜</a></li>
                        <li><a href="#">歌单</a></li>
                        <li><a href="#">主播电台</a></li>
                        <li><a href="#">歌手</a></li>
                        <li><a href="#">新碟上架</a></li>
                    </ul>
                </div>  
            </div>
          
        </div>
        <div class="contet">
            <div class="bg">
                <div class="tp">
                    <div class="tp-1"> </div>
                    <div class="tp-2">
                        <div class="Android">
                            <button><a href="#"><i class="iconfont icon-xiazaikehuduan"></i>下载客户端</a></button>
                        <p>PC安卓iPhone WP iPad Mac六大客户端</p>
                        </div>
                    </div>
                </div>
                <div class="nav-convert">
                    <a href="#"><</a>
                    <a href="#">></a>
                </div>
            </div>
            <div class="rm tp">
                <span>
                    <div class="nav-rm">
                        <div>
                            <ul>
                                <li><div><div></div></div></li>
                                <li><a href="#">热门推荐</a></li>
                                <li><a href="#">华语&nbsp;|</a></li>
                                <li><a href="#">流行&nbsp;|</a></li>
                                <li><a href="#">摇滚&nbsp;|</a></li>
                                <li><a href="#">民谣&nbsp;|</a></li>
                                <li><a href="#">电子</a></li>
                                <li><a href="#">更多</a>&nbsp;<i class="iconfont icon-ttd-copy"></i></li>
                            </ul>
                        </div>
                    </div>
                    <div class="tpwz">
                        <ul>
                            <li>
                                <div>
                                    <img src="images/109951166059862037.jpg">
                                    <a href="#">[欢快男嗓]温柔沉迷侵入心底!</a>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="images/109951166045325391.jpg">
                                    <a href="#">生活明朗|用微笑去开启每一-次好运.</a>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="images/109951166050502476.jpg">
                                    <a href="#">我字字皆你，你却句句非我</a>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="images/109951166050502476.jpg">
                                    <a href="#">我字字皆你，你却句句非我</a>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="images/109951166050502476.jpg">
                                    <a href="#">我字字皆你，你却句句非我</a>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="images/109951166058539622.jpg">
                                    <a href="#">12 便利店！便利店！便利店！</a>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="images/109951166058539622.jpg">
                                    <a href="#">12 便利店！便利店！便利店！</a>
                                </div>
                            </li>
                            <li>
                                <div>
                                    <img src="images/109951166058539622.jpg">
                                    <a href="#">12 便利店！便利店！便利店！</a>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <div class="newsong">
                        <div class="nav-rm">
                            <ul>
                                <li><div><div></div></div></li>
                                <li><a href="#">新碟上架</a></li>
                                <li><a href="#">更多</a>&nbsp;<i class="iconfont icon-ttd-copy"></i></li>
                            </ul>
                        </div>
                        <div class="newtype">
                            <a href="#"> <i class="iconfont icon-changyongtubiao-fuben-24"></i></a>
                            <ul>
                                <li>
                                    <div>
                                        <img src="images/109951166045325391.jpg" ><br>
                                        <a href="#">Couple Hunnid M.</a><br>
                                        <a href="#">谢帝</a>
                                    </div>
                                </li>
                                <li>
                                    <div>
                                        <img src="images/109951166059862037.jpg" ><br>
                                        <a href="#">为歌而赞第12期</a><br>
                                        <a href="#">为歌而赞</a>
                                    </div>
                                </li>
                                <li>
                                    <div>
                                        <img src="images/109951166004498861.jpg" ><br>
                                        <a href="#">Pale Blue</a><br>
                                        <a href="#">米津玄師</a>
                                    </div>
                                </li>
                                <li>
                                    <div>
                                        <img src="images/109951166031868739.jpg" ><br>
                                        <a href="#">朝翔</a><br>
                                        <a href="#">20XXCLUB</a>
                                    </div>
                                </li>
                                <li>
                                    <div>
                                        <img src="images/109951165984893515.jpg" ><br>
                                        <a href="#">青春的模样</a><br>
                                        <a href="#">王一博</a>
                                    </div>
                                </li>
                            </ul>
                            <a href="#"> <i class="iconfont icon-jiantou"></i></a>
                        </div>
                    </div>
                    <div class="list">
                        <div class="nav-rm">
                            <ul>
                                <li><div><div></div></div></li>
                                <li><a href="#">榜单&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></li>
                                <li><a href="#">更多</a>&nbsp;<i class="iconfont icon-ttd-copy"></i></li>
                            </ul>
                        </div>
                        <div class="newlist">
                            <table border="1" cellspacing="0">
                                <tr>
                                    <th>
                                        <div>
                                            <img src="images/18696095720518497.jpg">
                                        </div>
                                        <div class="bf">
                                            <p><a href="#">飙升榜</a></p>
                                            <a href="#">
                                                <i class="iconfont icon-bofang2"></i>
                                                <i class="iconfont icon-tabAdd"></i>
                                            </a>
                                        </div>
                                    </th>
                                    <th>
                                        <div>
                                            <img src="images/18713687906568048.jpg">
                                        </div>
                                        <div class="bf">
                                            <p><a href="#">新歌榜</a></p>
                                            <a href="#">
                                                <i class="iconfont icon-bofang2"></i>
                                                <i class="iconfont icon-tabAdd"></i>
                                            </a>
                                        </div>
                                    </th>
                                    <th>
                                        <div>
                                            <img src="images/18740076185638788.jpg">
                                        </div>
                                        <div class="bf">
                                            <p><a href="#">原创榜</a></p>
                                            <a href="#">
                                                <i class="iconfont icon-bofang2"></i>
                                                <i class="iconfont icon-tabAdd"></i>
                                            </a>
                                        </div>
                                    </th>
                                </tr>
                                <tr>
                                    <td>1<a href="#">好久不见</a></td>
                                    <td>1<a href="#">嘉宾</a></td>
                                    <td>1<a href="#">长街烟火</a></td>
                                </tr>
                                <tr>
                                    <td>2<a href="#">Peaches (Remix)</a></td>
                                    <td>2<a href="#">好久不见</a></td>
                                    <td>2<a href="#">你不在</a></td>
                                </tr>
                                <tr>
                                    <td>3<a href="#">最好</a></td>
                                    <td>3<a href="#">做勇敢的大人</a></td>
                                    <td>3<a href="#">十七岁seen years o10</a></td>
                                </tr>
                                <tr>
                                    <td>4<a href="#">超常发挥</a></td>
                                    <td>4<a href="#">窗</a></td>
                                    <td>4<a href="#">超常发挥</a></td>
                                </tr>
                                <tr>
                                    <td>5<a href="#">Stitches</a></td>
                                    <td>5<a href="#">拼个世界给自己(keeppley</a></td>
                                    <td>5<a href="#">漫步海边(skit)</a></td>
                                </tr>
                                <tr>
                                    <td><a href="#">查看全部></a></td>
                                    <td><a href="#">查看全部></a></td>
                                    <td><a href="#">查看全部></a></td>
                                </tr>
                            </table>
                        </div>
                    </div>
                </span>
                <span class="f2">
                    <div class="userinfo">
                        <div class="user">
                            <p>登录网易云音乐，可以享受无限收藏的</p>
                            <p>乐趣，并且无限同步到手机</p>
                            <button>用户登录</button>
                        </div>
                    </div>
                    <div class="selectall">
                        <div>
                            <a href="#">入驻歌手</a>
                            <a href="#">查看全部 ></a>
                        </div><hr>
                        <ul>
                            <li>
                                <a href="#">
                                    <img src="images/109951165588539704.jpg">
                                    <div>
                                        <h4>张惠妹aMEI</h4>
                                        <p>台湾歌手张惠妹</p>
                                    </div>
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="images/18806046882229308.jpg">
                                    <div>
                                        <h4>Fine乐团</h4>
                                        <p>独立音乐人</p>
                                    </div>
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="images/109951162916034289.jpg">
                                    <div>
                                        <h4>萬曉利</h4>
                                        <p>民谣歌手、中国现..</p>
                                    </div>
                                </a>
                            </li>
                            <li>
                               <a href="#">
                                <img src="images/109951166047225823.jpg">
                                <div>
                                    <h4>音乐人赵雷</h4>
                                    <p>民谣歌手</p>
                                </div>
                               </a>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="images/3438172872737957.jpg">
                                    <div>
                                        <h4>王三溥</h4>
                                        <p>音乐人</p>
                                    </div>
                                </a>
                            </li>
                        </ul>
                    </div>
                    <div class="butuser">
                        <button>申请成为网易音乐人</button>
                    </div>
                    <div class="rmzb">
                        <div>
                            <h5>热门主播</h5>
                        </div><hr>
                        <ul>
                            <li>
                                <a href="#">
                                    <img src="images/1407374893913311.jpg">
                                    <div>
                                        <h6>陈立</h6>
                                        <p>心理学家.美食家陈立教授</p>
                                    </div>
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="images/109951164843970584.jpg">
                                    <div>
                                        <h6>刘维-Julius</h6>
                                        <p>歌手、播客节目《维维道来..</p>
                                    </div>
                                </a>
                            </li>
                           <li>
                                <a href="#">
                                    <img src="images/109951165825466770.jpg">
                                    <div>
                                        <h6>莫非定律MoreFeel</h6>
                                        <p>男女双人全创作独立乐团</p>
                                    </div>
                                </a>
                            </li>
                            <li>
                               <a href="#">
                                <img src="images/109951165825466770.jpg">
                                <div>
                                    <h6>碎嘴许美达</h6>
                                    <p>脱口秀网络红人</p>
                                </div>
                               </a>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="images/109951163676573083.jpg">
                                    <div>
                                        <h6>银临Rachel</h6>
                                        <p>古风音乐人</p>
                                    </div>
                                </a>
                            </li>
                        </ul>
                    </div>
                </span>
            </div>
        </div>
        <div class="foot">
            <div class="footcontet">
               <div>
                <p>
                    <a href="#">服务条款</a>&nbsp;|&nbsp;
                    <a href="#">隐私政策</a>&nbsp;|&nbsp;
                    <a href="#">儿童隐私政策</a>&nbsp;|&nbsp;
                    <a href="#">版权投诉指引</a>&nbsp;|&nbsp;
                    <a href="#">意见反馈</a>&nbsp;|
                </p>
                <p>
                    <span>网易公司版权所有01997-2021&nbsp;&nbsp;</span>
                    <span>杭州乐读科技有限公司运营: &nbsp;</span>
                    <a href="#">浙网文[2021] 1186-054号</a>
                </p>
                <p>
                    <span>违法和不良信息举报电话:&nbsp; 0571-89853516&nbsp;&nbsp;</span>
                        <span>举报邮箱:&nbsp;</span>
                        <a href="#">ncm5990@163 com</a>
                </p>
                <p>
                    <a href="#">粤B2-20090191-18&nbsp;工业和信息化部备案管理系统网站。&nbsp;</a>
                    <a href="#">浙公网安备33010902002564号</a>
                </p>
               </div>
                <div class="musician">
                    <div>
                        <i class="iconfont icon-a"></i>
                        <p>Amped Studio</p>
                    </div>
                    <div>
                        <i class="iconfont icon-yonghurenzheng"></i>
                        <p>用户认证</p>
                    </div>
                    <div>
                        <i class="iconfont icon-duomeiti_yinle"></i>
                        <p>独立音乐人</p>
                    </div>
                    <div>
                        <i class="iconfont icon-zanshang"></i>
                        <p>赞赏</p>
                    </div>
                    <div>
                        <i class="iconfont icon-shipin"></i>
                        <p>视频奖励
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>